<%--
  Created by IntelliJ IDEA.
  User: zrw
  Date: 2019/11/28
  Time: 11:20
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录</title>
    <link rel="stylesheet" href="//unpkg.com/element-ui@2.13.0/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="/fonts/fontStyle.css">
    <script src="//unpkg.com/vue/dist/vue.js"></script>
    <script src="//unpkg.com/element-ui@2.13.0/lib/index.js"></script>
    <%--<link rel="stylesheet" href="../layui/css/layui.css">
    <script src="../layui/layui.js"></script>
    <script src="../js/jquery-3.4.1.min.js"></script>
    <style type="text/css">
        #con {
            width: 300px;
            margin: 60px auto;
        }
        #info {
            margin-left: 10px;
        }
        form {
            width: 300px;
            margin-top: 5px;
        }
        .layui-form-item {
            position: relative;
            border: 1px solid #E6E6E6;
        }
        .layui-icon {
            display: inline-block;
            color: #666666;
            font-size: 20px;
            font-weight: 600;
            position: absolute;
            top: 6px;
        }
        .layui-input-block {
            width: 270px;
            display: inline-block;
            margin-left: 24px;

        }
        #btndiv {
            margin-left: 0px;
        }
        .layui-input {
            color: #666666;
            font-size: 16px;
            font-weight: 600;
            border: none;
        }
        #btn {
            border-style: none;
        }
        .layui-btn-fluid {
            width: 300px;
        }
    </style>--%>
    <style type="text/css">
        body {
            font-family: PingFangSC-Regular;
        }
        #app {
            width: 260px;
            height: 190px;
            position: fixed;
            top: 50%;
            left: 50%;
            margin-top: -240px;
            margin-left: -130px;
            /*border: 1px solid #909399;*/
        }
        .block {
            width: 260px;
            margin-bottom: 10px;
            /*border: 1px solid red;*/
        }
        #app .block .el-tag{
            font-size: 14px;
        }
        input.el-input__inner {
            color: #000;
            font-size: 17px;
            font-weight: 600;
            font-family: PingFangSC-Regular;
        }
    </style>
</head>
<body>
    <form action="/check" method="post">
        <div id="app">
            <div class="block">
                <el-tag type="danger">查看通话时长之前，需要先登录。</el-tag>
            </div>
            <div class="block">
                <el-input
                        placeholder="请输入用户名"
                        prefix-icon="el-icon-user-solid"
                        v-model="input1"
                        clearable
                        name="username"
                >

                </el-input>
            </div>
            <div class="block">
                <el-input
                        placeholder="请输入密码"
                        prefix-icon="el-icon-s-goods"
                        v-model="input2"
                        clearable
                        show-password
                        name="password"
                >

                </el-input>
            </div>
            <div class="block">
                <el-button type="primary" native-type="submit" style="width: 260px;">登录</el-button>
            </div>
        </div>
        <script>
            var Main = {
                data() {
                    return {
                        input1: '',
                        input2: ''
                    }
                }
            }
            var Ctor = Vue.extend(Main);
            new Ctor().$mount('#app');
        </script>
    </form>

</body>
</html>
